<template>
  <el-form 
      label-width="120px"
      size="small">
    <el-row>
      <el-col :span="18">
        <el-form-item label="发布对象分类">
          <el-input disabled v-model="featurePublishForm.categoryName"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="18">
        <el-form-item label="发布对象名称">
          <el-input v-model="featurePublishForm.publishName"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="18">
        <el-form-item label="发布对象描述">
          <el-input v-model="featurePublishForm.description"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="20">
        <el-form-item label="业务对象">
          <el-transfer 
                :titles="titles" 
                v-model="featurePublishForm.featureIdList"
                :props="{
                  key: 'id',
                  label: 'label'
                }" 
                :data="featureArray">
          </el-transfer>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="18">
        <el-form-item label="数据库">
          <el-select v-model="featurePublishForm.databaseId" placeholder="请选择数据库">
            <el-option v-for="(item, index) in databaseList" :key="item.databaseId" :label="item.description" :value="item.databaseId"></el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>
<script>
  import { $DatabaseApi } from "@/network/datasource/DatabaseApi";
  import { $FeatureApi } from "@/network/feature/FeatureApi";

  export default {
    name: 'FeaturePublishForm',
    props: {
      formProps: {
        type: Object,
        default: null
      }
    },
    data() {
      return {
        featureArray: [],
        titles: ['可选业务对象', '已选业务对象'],
        databaseList: [],
        featurePublishForm: {
          publishName: '',
          description: "",
          categoryId: this.formProps.categoryId,
          categoryName: this.formProps.categoryName,
          databaseId: "",
          featureIdList: [],
        }
      }
    },

    methods: {
      
      async initFormData() {
        this.databaseList = (await $DatabaseApi.getDbList({})).data;
        this.featureArray = (await $FeatureApi.getFeatureList({})).data;        
      },

      takeFormData() {
        let formData = {...this.featurePublishForm};
        return formData;
      },

    },

    created() {
      this.initFormData();
    }

  }
</script>
<style>

</style>